<!DOCTYPE html>
<html>

    <head>
        <title>jquery.bootstrap-growl Demo</title>
        <link rel="stylesheet" type="text/css" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"> </head>

    <body>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
        <script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
        <script src="jquery.bootstrap-growl.js"></script>
        <script type="text/javascript">
            $(function()
            {
                $.bootstrapGrowl("This is a test.");
                setTimeout(function()
                {
                    $.bootstrapGrowl("This is another test.",
                    {
                        type: 'success'
                    });
                }, 1000);
                setTimeout(function()
                {
                    $.bootstrapGrowl("Danger, Danger!",
                    {
                        type: 'danger',
                        align: 'center',
                        width: 'auto',
                        allow_dismiss: false
                    });
                }, 2000);
                setTimeout(function()
                {
                    $.bootstrapGrowl("Danger, Danger!",
                    {
                        type: 'info',
                        align: 'left',
                        stackup_spacing: 30
                    });
                }, 3000);
            });
        </script>
    </body>

</html>